import 'package:flutter/material.dart';
import 'package:flutter_douban/config/app_colors.dart';
import 'package:flutter_douban/main_page/class/model/class_item_model.dart';
import 'package:flutter_douban/main_page/class/page/classroom_detail_page.dart';
import 'package:flutter_douban/main_page/class/provider/class_provider_model.dart';
import 'package:flutter_douban/tool_views/cached_network_Image.dart';
import 'package:provider/provider.dart';

class ClassItemView extends StatefulWidget {
  final List<ClassItemModel> list;
  final int index;
  final bool isHorizontal;

  const ClassItemView(
      {Key? key,
      required this.list,
      required this.index,
      required this.isHorizontal})
      : super(key: key);

  @override
  _ClassItemViewState createState() => _ClassItemViewState();
}

class _ClassItemViewState extends State<ClassItemView> {
  @override
  Widget build(BuildContext context) {
    return Container(
        margin: EdgeInsets.only(
            left: widget.index == 0 ? 20 : 0,
            right: widget.index == 19 ? 20 : 10),
        color: AppColors.page,
        child: Column(
          children: [
            Stack(
              children: [
                ClipRRect(
                  child: ShaderMask(
                    shaderCallback: (Rect bounds) {
                      return LinearGradient(
                        begin: Alignment.topCenter,
                        end: Alignment.bottomCenter,
                        colors: [
                          Colors.black,
                          Colors.transparent,
                          Colors.black
                        ],
                      ).createShader(bounds);
                    },
                    blendMode: BlendMode.color,
                    child: InkWell(
                      child: CachedImage(
                          url: widget.list[widget.index].i!,
                          width: 160,
                          height: 230),
                        onTap: () async {
                          //从子页面中传递过来的数据是异步的 data返回的值
                          var data = await Navigator.of(context).push(
                              MaterialPageRoute(
                                  builder: (BuildContext context) {
                                    return ClassRoomDetailPage(
                                        model: widget.list[widget.index]); //跳转到Detail页面组件
                                  }));
                          setState(() {
                            widget.list[widget.index].is_buy = data;
                          });
                        }
                    ),
                  ),
                  borderRadius: BorderRadius.circular(8),
                ),
                Positioned(
                  top: 8,
                  left: 8,
                  child: Container(
                    height: 18,
                    width: 45,
                    alignment: Alignment.center,
                    decoration: BoxDecoration(
                      color: AppColors.yellow,
                      border: new Border.all(color: AppColors.yellow, width: 1),
                      borderRadius: BorderRadius.circular(3),
                    ),
                    child: Text(
                      '直播回看',
                      style: TextStyle(fontSize: 10, color: AppColors.black),
                    ),
                  ),
                ),
                Positioned(
                  bottom: 8,
                  child: Container(
                    width: 160,
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.center,
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: [
                        Container(
                          height: 16,
                          width: 28,
                          alignment: Alignment.center,
                          decoration: BoxDecoration(
                            color: Colors.white,
                            border:
                                new Border.all(color: Colors.white, width: 1),
                            borderRadius: BorderRadius.circular(3),
                          ),
                          child: Text(
                            '老师',
                            style:
                                TextStyle(fontSize: 11, color: AppColors.black),
                          ),
                        ),
                        SizedBox(
                          height: 6,
                        ),
                        Text(
                          widget.list[widget.index].un!,
                          style: TextStyle(fontSize: 12, color: Colors.white),
                        )
                      ],
                    ),
                  ),
                )
              ],
            ),
            Container(
              width: (MediaQuery.of(context).size.width-100)/2,
              height: 70,
              padding: EdgeInsets.only(top: 5),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    widget.list[widget.index].t!,
                    style: TextStyle(fontSize: 13, color: Colors.black),
                    overflow: TextOverflow.ellipsis,
                    maxLines: 2,
                  ),
                  SizedBox(
                    height: 2,
                  ),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      Text(
                        widget.list[widget.index].ec!.toString() + '人加入学习',
                        style: TextStyle(fontSize: 12, color: Colors.grey),
                        overflow: TextOverflow.ellipsis,
                        maxLines: 2,
                      ),
                      InkWell(
                        onTap: (){
                          Provider.of<ClassProviderModel>(context,listen: false).add(widget.list[widget.index]);
                          setState(() {
                            if (widget.list[widget.index].is_buy == null) {
                              widget.list[widget.index].is_buy = false;
                            }
                            if (widget.list[widget.index].is_buy == true) {
                              return;
                            }
                            widget.list[widget.index].is_buy =
                            !widget.list[widget.index].is_buy!;
                          });
                        },
                        child: Container(
                          width: 40,
                          height: 22,
                          alignment: Alignment.center,
                          decoration: BoxDecoration(
                            color: (widget.list[widget.index].is_buy == false ||
                                widget.list[widget.index].is_buy == null)
                                ? AppColors.yellow
                                : Color.fromRGBO(209, 209, 209, 1),
                            // border: new Border.all(color: AppColors.yellow, width: 1),
                            borderRadius: BorderRadius.circular(3),
                          ),
                          child: Text(
                            '购买',
                            style: TextStyle(fontSize: 12,color: Colors.black),
                          ),
                        ),
                      )
                    ],
                  ),
                ],
              ),
            )
          ],
        ));
  }
}
